<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> 什么是 #document？</title>
</head>
<body>

<div>
    什么是 #document？

    在 HTML 中，#document 表示文档对象模型（DOM）的根节点。
    DOM 是一种表示 HTML 或 XML 文档的标准编程接口，它将网页文档映射为一个由对象组成的树状结构。
    这个树状结构中的根节点就是 #document。

</div>

<iframe id="subIframe" name="subIframe" src="sub.html" frameborder="0" scrolling="auto"></iframe>



</body>

<script>

    //1. 获取网页标题
    console.log(document.title); // 输出网页标题
    //2. 遍历网页节点
    const nodes = document.childNodes;
    for (let i = 0; i < nodes.length; i++) {
        console.log(nodes[i]);
    }
    //3. 修改网页内容
    const newElement = document.createElement('p');
    newElement.textContent = '这是新添加的段落！';
    document.body.appendChild(newElement);

    //更改网页的样式
    const docStyle = document.documentElement.style;
    docStyle.backgroundColor = 'blue';
    docStyle.color = 'white';


</script>


</html>
